<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>日常记录</title>
  <link rel="stylesheet" href="layui/css/layui.css">
  <link rel="stylesheet" href="css/date.css">
</head>
<body>
 
<!-- 你的HTML代码 -->

	<div class="layui-container" style="padding: 15px;">  
	  <div class="layui-row">
	    <div class="layui-col-md12">
	    <blockquote class="layui-elem-quote">☞☞&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;☂☂❤❤王丫丫❤❤健康表☂☂&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;☜☜</blockquote>
	    <div class="layui-inline" id="test-n2" ></div>
	    </div>
	  </div>
	</div>

<script src="../common/common.js"></script>
<script src="layui/layui.js"></script>
<script src="js/jquery-1.11.2.min.js"></script>

<script>

$(document).on('touchmove',function(e){
	e.preventDefault();
});

//获取选中时间的记录
var dataResult = "";
//获取项目中的访问路径
var BASE_PATH = basePath();

//$("td[lay-ymd='2018-6-3']").css('background-color','green'); 此方法为动态赋值颜色
$(function(){

	layui.use(['layer', 'form','jquery','laydate'], function() {
		var layer = layui.layer,
			$ = layui.jquery,
			laydate = layui.laydate,
			form = layui.form;
			
			//定义json	
			var  data={};
			
			var new_date = new Date();
			loding_date(new_date ,data);


		//日历插件调用方法  
		function loding_date(date_value,data){
		
		  	laydate.render({
			    elem: '#test-n2',
			    type: 'date',
			    theme: 'grid',
			    max: '2099-06-16 23:59:59',
			    position: 'static',
			    range: false,
			    value:date_value,
			    calendar: true,
			    btns:false,
			    done: function(value, date, endDate){
				    console.log(value); //得到日期生成的值，如：2017-08-18
				    console.log(date); //得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
				    console.log(endDate); //得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
				    //layer.msg(value)
				    var nowTime = date.year+"-"+date.month+"-"+date.date;
				    console.log(nowTime);
				    //调用弹出层方法
				    date_chose(value,data,nowTime);
			    },
			    mark:data//重要json！
		  });

		}

      	//获取隐藏的弹出层内容       var date_choebox = $('.date_box').html();
  
	  	//定义弹出层方法
	  	function date_chose(obj_date,data,nowTime){
	  		if (nowTime) {
	  			$.ajax({
	                  url: BASE_PATH + "illnessRecord/queryNowTimeHasRecord",
	                  type: 'POST',
	                  dataType: 'json',
	                  data: {
	                  	"nowTime" :nowTime
	                  }
	            })
	            .done(function(data) {
	            	//判断当前选中时间是否有记录
	                if (data.result != null) {
	                  		console.log(data);
	                  		dataResult = data.result;
	                } else {

/*	                	layer.open({

						  	title: '消息提醒',
						  	content: '当前时间未录入'
						});  */   
	                }
	            });
	  		}
			layer.open({
			 	title: '成长快乐',
			  	type : 2,  
			 	content:'http://192.168.1.6:8080/notepad/record.html',
			  	anim: 2,
			  	area: ['400px', '600px']
			});   
	  	}
  
		//定义添加/编辑标注方法
		function chose_moban(obj_date,markJson){
		  	//获取弹出层val
		  	var chose_moban_val = $('#text_book').val();
		  
		   	$('#test-n2').html('');//重要！由于插件是嵌套指定容器，再次调用前需要清空原日历控件
		    //添加属性 
		    markJson[obj_date] = chose_moban_val;
		    console.log(JSON.stringify(markJson));
		 	
		    //再次调用日历控件，
		    loding_date(obj_date,markJson);//重要！，再标注一个日期后会刷新当前日期变为初始值，所以必须调用当前选定日期。
		  	
		}

		//撤销选择
		function chexiao(obj_date,markJson){
		    //删除指定日期标注
		    delete markJson[obj_date]; 
		    console.log(JSON.stringify(markJson));
		    //原理同添加一致
		    $('#test-n2').html('');
		    loding_date(obj_date,markJson);
		}

	});

	setTimeout(function(){
		initLayDate();
	},1000);
});

	//
	function clearLayDate(){
		var new_date = new Date();

		$('#test-n2').html('');//重要！由于插件是嵌套指定容器，再次调用前需要清空原日历控件
		loding_date(new_date,"");//重要！，再标注一个日期后会刷新当前日期变为初始值，所以必须调用当前选定日期。
	}

	function initLayDate(){

			//记录数据
	        $.ajax({
	              url: BASE_PATH + "illnessRecord/illnessRecords",
	              type: 'POST',
	              dataType: 'json',
	        })
	        .done(function(data) {
	              console.log(data);
	              if (data) {
	              		if (data.status == "ok") {
	              			for (var i = 0; i < data.result.length; i++) {
	              				$("td[lay-ymd='"+data.result[i].recordDate+"']").css('background-color',data.result[i].colorNumberName);
	              			}
	              		}
	              }
	              else {
	              	console.log("data read filed");
	              }
	         });
	}
</script> 
</body>
</html>
